<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="/WEB-INF/templates/UserTemplate.xhtml">

	<ui:define name="content">

		<!-- Element Primefaces extensible contenant les champs de création du nouveau projet -->
		<p:accordionPanel>
			<p:tab title="Créer un nouveau projet">
				<h:form>
					<p:panel header="Validate">
						<p:messages />

						<!-- Définition du PanelGrid contenant tous les champs de création du nouvel employé -->
						<h:panelGrid columns="3" cellpadding="5">

							<!-- Champ "E mail" -->
							<h:outputLabel for="proName" value="Project name" />
							<p:inputText id="proName"
								value="#{projectList.additionBean.proName}" label="Project name" />
							<p:message for="proName" />

							<!-- Champ "Project budget" -->
							<h:outputLabel for="proBudget" value="Project budget" />
							<p:inputText id="proBudget"
								value="#{projectList.additionBean.proBudget}"
								label="Project budget" />
							<p:message for="proBudget" />

							<!-- Champ "Project description" -->
							<h:outputLabel for="proDescription" value="Project description" />
							<p:inputTextarea rows="3" cols="33" id="proDescription"
								value="#{projectList.additionBean.proDescription}"
								label="Project description" />
							<p:message for="proDescription" />

							<!-- A RAJOUTER : LES CHAMPS D'INSCRIPTION DES ACTIVITES ET DES EMPLOYES A JOINDRE A CE PROJET -->
						</h:panelGrid>

						<!-- Bouton appelant la méthode addProject() du bean "ProjectAdditionBean"
  					permettant d'insérer un nouvel utilisateur -->
						<p:commandButton value="Créer" update="form" ajax="false"
							icon="ui-icon-check" validateClient="true"
							action="#{projectList.addProject}" />

					</p:panel>
				</h:form>
			</p:tab>
		</p:accordionPanel>

		<!-- Section d'affichage des projets déjà présents en base de données -->
		<h:form id="form">

			<!-- Setting de la pop-up qui s'affiche mors d'un clic droit sur un projet à modifier -->
			<p:contextMenu for="projectList">
				<p:menuitem value="Ajouter une tâche" update="form"
					icon="ui-icon-search" oncomplete="PF('documentDialog').show()" />
			</p:contextMenu>

			<p:growl id="messages" showDetail="true" />

			<p:treeTable var="pro" value="#{projectList.root}" id="projectList"
				selectionMode="single" selection="#{projectList.selectedNode}">

				<f:facet name="header"> Listes des projects que vous gérez </f:facet>

				<p:column style="width:25%">
					<f:facet name="header"> Name  </f:facet>
						<h:outputText value="#{pro.proName}" />
				</p:column>

				<p:column style="width:25%">
					<f:facet name="header"> Budget  </f:facet>
						<h:outputText value="#{pro.proBudget} euros" />
					</p:column>

				<p:column style="width:50%">
					<f:facet name="header"> Activités  </f:facet>
					<p:selectOneListbox id="scroll" value="#{pro.activities}" var="act"
						style="height:50px">
						<f:selectItems value="#{pro.activities}" var="act"
							itemLabel="#{act}" itemValue="#{act}" />

						<f:selectItem itemLabel="#{act.actDescription}" />
						<p:column>  
                #{act.actDescription}
            </p:column>

					</p:selectOneListbox>
				</p:column>

				<p:column style="width:25%">
					<f:facet name="header"> Description </f:facet>
						<h:outputText value="#{pro.proDescription}" />
				</p:column>

			</p:treeTable>
			
			<p:dialog header="Ajouter une tâche" showEffect="fade"
				widgetVar="documentDialog" modal="true">
				<p:outputPanel id="documentPanel">

					<h:outputLabel value="Tâche : " />
					<p:inputText value="#{newtask}" />
					<p:commandButton for="pro" value="Ajouter" ajax="false"
						icon="ui-icon-check" validateClient="true"
						oncomplete="PF('documentDialog').hide()"
						action="#{project.addActivity(newtask, projectList.selectedNode)}" />

				</p:outputPanel>
			</p:dialog>



		</h:form>

	</ui:define>

</ui:composition>
</html>


